<template>
  <div>
    <el-divider></el-divider>
    <div style="font-size:20px;text-align:left">
      <i class="el-icon-document-checked">窗口退号</i>
    </div>
    <el-divider></el-divider>
    <el-row :gutter="20">
      <el-col :span="6"><el-input v-model="caseNumber" placeholder="请输入患者病历号"></el-input></el-col>
      <el-col :span="6"><el-input v-model="realName" placeholder="请输入患者姓名"></el-input></el-col>
      <el-col :span="2"><el-button @click="select">搜索</el-button></el-col>
      <el-col :span="10"> </el-col>
    </el-row>
    <el-divider></el-divider>
    <el-table
      :data="waitPatient">
      <el-table-column        type="index"     label="编号"        width="80"></el-table-column>
      <el-table-column        prop="caseNumber"        label="患者病历号">      </el-table-column>
      <el-table-column        prop="realName"        label="患者姓名"        width="180"></el-table-column>
      <el-table-column        prop="gender"        label="性别"        width="80"></el-table-column>
      <el-table-column        prop="cardNumber"        label="身份证号"        width="240"></el-table-column>
      <el-table-column        prop="registMethod"        label="付款方式"        width="180"></el-table-column>
      <el-table-column label="操作">
      <template #default="scope">
        <el-button  type="warning"  size="mini" @click="udateState(scope.$index, scope.row)">退号</el-button>
      </template>
    </el-table-column>
    </el-table>
    <el-divider></el-divider>
    <el-pagination
        :default-current-page="currPage"
    :page-size="pageSize" :total="totalCount" @current-change="table_change"
    layout="prev, pager, next">
  </el-pagination>
  </div>
</template>
<script>
    export default {
      data() {
        return {
          caseNumber:'',
          realName:'',
          pageSize:5,//每页显示行数
          totalCount:0,
          employeeId:4,//当前医生的id
          waitPatient: [], //已挂号的数组
          currPage:1, //当前页
        }
      },
      methods:{

        table_change:function (currPage)
        {
          this.currPage=currPage
          this.select()
        },
        //分页查询
        select:function ()
        {
            let register={
              "caseNumber":this.caseNumber,
              "realName":this.realName
            }
            let url=`http://localhost:8092/register/selectstatepage/${this.currPage}`
            this.$axios.post(url,register).then(resp=>{
              this.waitPatient=resp.data.result
              this.totalCount=resp.data.total
              console.log(this.waitPatient)
            }).catch(error=>{
              console.log(error)
            })
        },
        //退号
        udateState:function (index, row){
          console.log(index,row)
          if(confirm("真的要退号？"))
          {
            let url='http://localhost:8092/register/updatestate'
            let regist={
              "visitState":"4",
              "id":row.id
            }
            this.$axios.put(url,regist).then(resp=>{
              this.select()
            }).catch(error=>{
              console.log(error)
            })
          }
        },


      },
      mounted() {
        this.select()
      }
    }
  </script>